import {
  getDataTypeOptionsReq,
  getTableDetailReq
} from '@/service/modules/data-manage'
import {
  ColumnInfo,
  IndexInfo,
  TableInfo
} from '@/service/modules/data-manage/types'
import { SelectOption } from 'naive-ui'
import { reactive } from 'vue'

export function useTable() {
  const state = reactive({
    tableDetail: null,
    dataTypeOptions: Array<SelectOption>(),
    loading: false
  })
  const modifyTableEntity = reactive({
    datasourceId: 0,
    dbName: '',
    tableName: '',
    reason: '',
    mode: 'visual',
    ddl: '',
    tableInfo: {
      tableName: '',
      tableComment: '',
      ddl: '',
      columns: Array<ColumnInfo>(),
      indexs: Array<IndexInfo>()
    },
    previewData: '{}'
  })
  const getTableDetail = async (
    datasourceId: number,
    dbName: string,
    tableName: string
  ) => {
    if (state.loading) return
    state.loading = true
    const res = await getTableDetailReq({
      datasourceId: datasourceId,
      dbName: dbName,
      tableName: tableName
    })
    state.loading = false
    if (res.resp_code === 0) {
      state.tableDetail = res.data as TableInfo
      modifyTableEntity.tableInfo = res.data as TableInfo
      modifyTableEntity.previewData = state.tableDetail.previewData
      modifyTableEntity.datasourceId = state.tableDetail.datasourceId
      modifyTableEntity.dbName = state.tableDetail.dbName
      modifyTableEntity.tableName = state.tableDetail.tableName
      modifyTableEntity.tableInfo.columns.forEach((item) => {
        item.newField = false
      })
      await getDataTypeOptions(state.tableDetail.databaseId)
    }
  }
  const getDataTypeOptions = async (databaseId: number) => {
    if (state.loading) return
    state.loading = true
    const res = await getDataTypeOptionsReq({ databaseId: databaseId })
    state.loading = false
    if (res.resp_code === 0) {
      state.dataTypeOptions.splice(0)
      res.data.forEach((element: string) => {
        state.dataTypeOptions.push({
          label: element,
          value: element
        })
      })
    }
  }

  const onOperationClick = (
    index: number,
    type: 'insertField' | 'removeField' | 'moveUpField' | 'moveDownField'
  ) => {
    switch (type) {
      case 'insertField':
        modifyTableEntity.tableInfo.columns.splice(index + 1, 0, {
          columnName: 'new_column',
          dataType: state.dataTypeOptions[0].value as string,
          args: '',
          isNotNull: false,
          defVal: '',
          isPrimkey: false,
          isPartition: false,
          columnComment: '',
          previewData: '',
          newField: true
        })
        break
      case 'removeField':
        modifyTableEntity.tableInfo.columns.splice(index, 1)
        break
      case 'moveUpField':
        if (index === 0) return
        const up1 = modifyTableEntity.tableInfo.columns[index - 1]
        if (!up1.newField) return
        const down1 = modifyTableEntity.tableInfo.columns[index]
        modifyTableEntity.tableInfo.columns[index - 1] = down1
        modifyTableEntity.tableInfo.columns[index] = up1
        break
      case 'moveDownField':
        if (index === modifyTableEntity.tableInfo.columns.length - 1) return
        const up2 = modifyTableEntity.tableInfo.columns[index]
        const down2 = modifyTableEntity.tableInfo.columns[index + 1]
        modifyTableEntity.tableInfo.columns[index] = down2
        modifyTableEntity.tableInfo.columns[index + 1] = up2
        break
    }
  }

  return {
    state,
    modifyTableEntity,
    getTableDetail,
    getDataTypeOptions,
    onOperationClick
  }
}
